import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)

// import indexPage from '../views/index.vue'
// import loginPage from '../views/login.vue'
// 2. 定义一些路由
// 每个路由都需要映射到一个组件。
// 我们后面再讨论嵌套路由。
const routes = [
    { path: '/', redirect: '/index' },  //箭头函数也可用,而且这是一个8080进入的首页，显示的第一页面
    {
      path: '/index', 
      component:() => import('../views/index'),
      redirect: '/index/banners',
      meta: { title: '首页' },
      children: [       
          {path: 'banners',
          meta: { title: '轮播图管理' }, 
          component:() => import('../views/shouye/banner'),
          beforeEnter:(to, from,next) => {          
            // console.log('独享守卫')
            next()
          }
        },
          {path: 'category',meta: { title: '分类区管理' }, component:() => import('../views/shouye/category')},
          {path: 'recommend',meta: { title: '分类推荐管理' }, component:() => import('../views/shouye/recommend')} ,
          {path: 'text',meta: { title: '我的测试页面' }, component:() => import('../views/new/text')}, 
          {path: 'donghuan',meta: { title: '我的动画页面' }, component:() => import('../views/new/donghuan')},   
          {path: 'fenlei',meta: { title: '分类管理' }, component:() => import('../views/shangpin/fenlei')}     
      ]
    },
    { path: '/login', component:() => import('../views/login') },
    // { path: '/', component:indexPage },  //和第五行一起使用，像loginPage
    // { path: '/login', component:loginPage} ,
  ]
// 3. 创建路由实例并传递 `routes` 配置
// 你可以在这里输入更多的配置，但我们在这里
// 暂时保持简单
const router = new VueRouter({
    routes //routes:routes 的缩写
})

router.beforeEach((to, from,next) => {
  // ...
  // 返回 false 以取消导航
  // console.log(to,from)
  next()
  // return to
})

  export default router